<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/jquery.min.js"></script>
		<style>
			#selectALL{
				margin-right: 10px;
			}
			#selectALL:hover{
				background-color: #008CF4;
			}
		</style>
	</head>
	<body>
		<div id="msg">使用jQuery实现字体变化</div>
		<button id="pay">支付宝支付</button>
		<div style="margin: 20px;">
		<input type="checkbox" id="ck" />红色
		<input type="checkbox" id="ck" />绿色
		<input type="checkbox" id="ck" />蓝色
		</div>
		<div>
			<button id="selectALL" >全选</button>
			<button id="unSelectALL" >取消</button>
		</div>
	</body>
	<script>
		$().ready(function() {//ready()当页面被载入并且DOM树完成初始化后触发。
			$("#msg").css("font-size", 36); //获取对象$("#id")
			$("#msg").css("color", "red");

			$("#pay").click(function() {
				$("#pay").prop("disabled", true); //灰色按钮禁止点击

			});
			$("#selectALL").click(function(){
			$("[id=ck]").prop("checked",true);//所有ck全部选中
				
			});
			$("#unSelectALL").click(function(){
			$("[id=ck]").prop("checked",false);//所有ck全部选中
				
			});
			
		});
	</script>
</html>
